<template>
	<view class="news">
	<!-- 	<view class="item">
			<image class="avatar h-left" src="/static/imgs/public/shopPic-01.png" mode=""></image>
			<view class="label">13</view>
			<view class="h-center">
				<view class="store">金贝勒旗舰店</view>
				<view class="remind" >验收提醒</view>
			</view>
			<view class="h-right">
				<text class="time">10.18</text>
				<text class="response" @click="navTo(`/pages/public/newsDeatils?name=金贝勒旗舰店`)">回复</text>
			</view>
		</view> -->

	<!-- 	<view class="item">
			<image class="avatar h-left" src="/static/imgs/public/shopPic-02.png" mode=""></image>
			<view class="label">1</view>
			<view class="h-center">
				<view class="store">瑞派宠物店</view>
				<view class="remind" >回复@天使的翅膀</view>
			</view>
			<view class="h-right">
				<text class="time">09.26</text>
				<text class="response">回复</text>
			</view>
		</view> -->

		<view class="item" v-for="(item,index) in userInfo" :key="index">
			<image class="avatar h-left" :src="item.shop_img" mode=""></image>
			<view class="label">1</view>
			<view class="h-center">
				<view class="store">{{item.shop_name}}</view>
				<view class="remind" >{{item.name}}</view>
			</view>
			<view class="h-right">
				<text class="time">{{item.message_time}}</text>
				<text class="response" @click="navTo(item.shop_id)">回复</text>
			</view>
		</view>
		
	<!-- 	<view class="item">
			<image class="avatar h-left" src="/static/imgs/public/shopPic-03.png" mode=""></image>
			<view class="label">1</view>
			<view class="h-center">
				<view class="store">用户通知</view>
				<view class="remind" >感谢您在邻品汇购物...</view>
			</view>
			<view class="h-right">
				<text class="time">10.18</text>
				<text class="response">回复</text>
			</view>
		</view> -->
	<!-- 	<view class="item">
			<image class="avatar h-left" src="/static/imgs/public/shopPic-04.png" mode=""></image>
			<view class="label">1</view>
			<view class="h-center">
				<view class="store">爱购二手电脑专营店</view>
				<view class="remind" >嗯嗯，好的</view>
			</view>
			<view class="h-right">
				<text class="time">10.18</text>
				<text class="response">回复</text>
			</view>
		</view> -->
		
	<!-- 	<view class="item">
			<image class="avatar h-left" src="/static/imgs/public/shopPic-04.png" mode=""></image>
			<view class="label">1</view>
			<view class="h-center">
				<view class="store">交易物流</view>
				<view class="remind" >皇室猫粮10kg...</view>
			</view>
			<view class="h-right">
				<text class="time">10.18</text>
				<text class="response">回复</text>
			</view>
		</view> -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo:[],
			};
		},
		onLoad(option) {
			this.getShopPush()
		},
		methods: {
			async getShopPush(){
				let res = await this.$http.userInfoPush();
				this.userInfo = res.data
				console.log(this.userInfo)
				console.log(res)
			},
			
			navTo(id){
				uni.navigateTo({
					url:'/pages/public/userInform?shopId='+JSON.stringify(id)
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		height: 100%;
		background-color: $bg01;
	}

	.news {
		margin-top: 40upx;
		border-radius: 20upx;
	}

	.item {
		display: flex;
		align-items: center;
		height: 140upx;
		padding: 0 30upx 0 15upx;
		background-color: #fff;
		border-bottom: 1px solid $bg01;
		position: relative;
		.label{
			position: absolute;
			top: 8upx;
			left: 90upx;
			width: 32upx;
			height: 32upx;
			border-radius: 50%;
			background-color: $bg02;
			color: #fff;
			font-size: 24upx;
			text-align: center;
		}
		.avatar {
			width: 100upx;
			height: 100upx;
			border-radius: 50%;
		}

		.h-left {
			margin: 0 20upx 0 0upx;
		}

		.h-center {
			flex: 3;
			.store{
				font-size: 36upx;
				color: $color3;
			}
			.remind{
				font-size: 24upx;
				color: $color6;
			}
		}

		.h-right {
			flex: 1.5;
			flex-direction: column;
			text-align: right;

			.time {
				display: block;
				font-size: 24upx;
				color: #666;
			}

			.response {
				width: 88upx;
				height: 46upx;
				font-size: 26upx;
				padding: 0 10upx;
				border: 1px solid $bg02;
				color: $bg02;
				border-radius: 15upx;
			}
		}

	}
</style>
